<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.js"></script>

<title>Test</title>

<script type="text/javascript">
function success_callback() {
	$("<h3>").text(this.title).appendTo("#content");
	$("<div>").text(this.content).appendTo("#content");
	$("<h4>").text(this.created_on).appendTo("#content");
};

$(function() {
	var dict = {
		url: "/api/posts/show",
		success: function(json, textStatus) {$.each(json, success_callback)},
		dataType: "json"
	};
		
	$.ajax(dict);
});

function send_form() {
           function(json, textStatus) {
			$("<h3>").text(json.title).appendTo("#content");
			$("<div>").text(json.content).appendTo("#content");
			$("<h4>").text(json.created_on).appendTo("#content");
		}
		
};

</script>
</head>

<body>
	<h1>JS Test</h1>
	<div id="content">
	</div>
	<form id="id_form" action="/api/posts/add" method="post">
		<label for="id_title">Title:</label>
		<input type="text" id="id_title" name="title" />
		<br />
		<label for="id_content">Content:</label>
		<textarea cols="40" rows="20" id="id_content" name="content"></textarea>
		<br />
		<!input type="submit" onclick="return send_form();" value="Submit" />
		<input type="submit" onclick="return send_form();" name="next" value="Submit" />

	</form>
</body>

</html>
